$player: () !default;

$player: map-merge(
    (
        bodyBackground: #fff,
    ),
    $player
);

$playerBodyBackground: map-get($player, bodyBackground);

#player.aplayer {
    background: none;
}

#player.aplayer .aplayer-list ol li {
    background: $playerBodyBackground;
}

#player {
    &:hover {
        .aplayer-list {
            transform: scaleX(1);
            left: 0;
        }
        .aplayer-body {
            left: 0;
        }
    }
    .aplayer-list {
        position: relative;
        transform: scaleX(0.838);
        left: -34px;
    }
    .aplayer-body {
        left: -66px;
        background-color: $playerBodyBackground;
        // &:hover {
        //     left: 0;
        // }
        .aplayer-info {
            border-top: none;
        }
        .aplayer-miniswitcher {
            background-color: $playerBodyBackground;
            border-left: 1px solid #999;
        }
    }
    .aplayer-lrc {
        display: none;
        .aplayer-lrc-contents {
            color: inherit;
            p {
                color: inherit;
                font-size: 14px;
                text-shadow: none;
            }
        }
    }
}

@media screen and (max-width: 767px) {
    #player {
        display: none;
    }
}
